import 'dart:developer';

import 'package:flutter/material.dart';

class TabbarDemo2 extends StatefulWidget {
  const TabbarDemo2({Key? key}) : super(key: key);

  @override
  _TabbarDemo2State createState() => _TabbarDemo2State();
}

class _TabbarDemo2State extends State<TabbarDemo2> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(primaryColor: Colors.yellow),
      home: SampleTabbar2(),
    );
  }
}

class SampleTabbar2 extends StatefulWidget {
  const SampleTabbar2({Key? key}) : super(key: key);

  @override
  _SampleTabbar2State createState() => _SampleTabbar2State();
}

class _SampleTabbar2State extends State<SampleTabbar2>
    with SingleTickerProviderStateMixin {
  List<Tab> tabs = <Tab>[
    Tab(
      // text: 'Zeroth',
      icon: Icon(Icons.style),
    ),
    Tab(
        // text: 'First',
        icon: Icon(Icons.star)),
    Tab(
        // text: 'Second',
        icon: Icon(Icons.bolt)),
  ];

  List<String> titles = <String>["Zeroth", "First", "Second"];

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
        length: tabs.length,
        child: Builder(
          builder: (context) {
            final tabController = DefaultTabController.of(context)!;
            tabController.addListener(() {
              log("tab change");
            });
            return Scaffold(
              appBar: AppBar(
                elevation: 0.0,
                title: Text(
                  "Tabbar Demo",
                  style: TextStyle(
                      color: Colors.cyan,
                      fontWeight: FontWeight.w300,
                      letterSpacing: 3.0),
                ),
                centerTitle: true,
                bottom: TabBar(
                  tabs: tabs,
                  controller: tabController,
                ),
              ),
              // body: TabBarView(children: tabs,controller: _tabController,),
              body: TabBarView(
                children: titles.map((e) {
                  return Center(
                    child: Text(
                      "${e.toUpperCase()}",
                      style: TextStyle(fontSize: 36),
                    ),
                  );
                }).toList(),
                controller: tabController,
              ),
            );
          },
        ));
  }
}
